// 深色主题样式 - 完全覆盖
$theme-name: 'dark';

// 深色主题颜色变量 - 基于cp-ems-ui的配色
$theme-bg-color: #46576e;
$theme-bg-mask: linear-gradient(135deg, rgba(70, 87, 110, 0.9) 0%, rgba(44, 61, 85, 0.9) 100%);

// 前景色
$theme-front-color: #ffffff;

// 菜单相关颜色
$theme-menu-item-color: #88a7b1;
$theme-menu-item-color-hover: #a5def1;
$theme-menu-item-background-color: #2a3950;
$theme-menu-item-background-color-hover: #222e41;

// 顶栏相关颜色
$theme-header-item-color: #ffffff;
$theme-header-item-color-hover: #a5def1;
$theme-header-item-color-focus: #a5def1;
$theme-header-item-color-active: #a5def1;
$theme-header-item-background-color: #1c2e47;
$theme-header-item-background-color-hover: #222e41;
$theme-header-item-background-color-focus: #222e41;
$theme-header-item-background-color-active: #3a7b99;

// 侧边栏相关颜色
$theme-aside-item-color: #88a7b1;
$theme-aside-item-color-hover: #a5def1;
$theme-aside-item-color-focus: #a5def1;
$theme-aside-item-color-active: #c0edfc;
$theme-aside-item-background-color: #2a3950;
$theme-aside-item-background-color-hover: #222e41;
$theme-aside-item-background-color-focus: #222e41;
$theme-aside-item-background-color-active: #3a7b99;

// 侧边栏菜单为空时的样式
$theme-aside-menu-empty-background-color: #2a3950;
$theme-aside-menu-empty-background-color-hover: #222e41;
$theme-aside-menu-empty-icon-color: #88a7b1;
$theme-aside-menu-empty-icon-color-hover: #a5def1;
$theme-aside-menu-empty-text-color: #88a7b1;
$theme-aside-menu-empty-text-color-hover: #a5def1;

// 多页面控制器相关颜色
$theme-multiple-page-control-color: #88a7b1;
$theme-multiple-page-control-color-active: #c0edfc;
$theme-multiple-page-control-background-color: #1c2e47;
$theme-multiple-page-control-background-color-active: #3a7b99;
$theme-multiple-page-control-border-color: #213653;
$theme-multiple-page-control-border-color-active: #3a7b99;
$theme-multiple-page-control-nav-prev-color: #88a7b1;
$theme-multiple-page-control-nav-next-color: #88a7b1;

// 容器相关颜色
$theme-container-background-color: #2c3d55;
$theme-container-header-footer-background-color: #2a3950;
$theme-container-border-outer: 1px solid #5f6e8a;
$theme-container-border-inner: 1px solid #5f6e8a;

// 消息相关颜色
$theme-message-info-background-color: #2a3950;
$theme-message-info-text-color: #ffffff;
$theme-message-info-border-color: #3a7b99;

@import '../theme.scss';

// 全局深色主题覆盖
body {
  background-color: #46576e !important;
  color: #ffffff !important;
}

#app {
  background-color: #46576e !important;
  color: #ffffff !important;
}

// 强制应用深色主题到所有页面
* {
  &:not(.el-loading-mask):not(.el-loading-spinner):not(.el-icon-loading) {
    color: inherit;
  }
}

// Element UI 全局深色主题
.el-card {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  color: #ffffff !important;
  
  .el-card__header {
    background-color: #2a3950 !important;
    border-bottom: 1px solid #5f6e8a !important;
    color: #ffffff !important;
  }
  
  .el-card__body {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
  }
}

.el-table {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
  
  th {
    background-color: #2a3950 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #5f6e8a !important;
  }
  
  td {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(95, 110, 138, 0.3) !important;
  }
  
  tr:hover td {
    background-color: #323e52 !important;
  }
  
  .el-table__empty-block {
    background-color: #2c3d55 !important;
  }
  
  .el-table__empty-text {
    color: #88a7b1 !important;
  }
}

.el-pagination {
  background-color: transparent !important;
  
  .el-pager li {
    background-color: #2c3d55 !important;
    color: #88a7b1 !important;
    border: 1px solid #5f6e8a !important;
    
    &:hover {
      color: #a5def1 !important;
      background-color: #222e41 !important;
    }
    
    &.active {
      background-color: #3a7b99 !important;
      color: #ffffff !important;
      border-color: #3a7b99 !important;
    }
  }
  
  .btn-prev, .btn-next {
    background-color: #2c3d55 !important;
    color: #88a7b1 !important;
    border: 1px solid #5f6e8a !important;
    
    &:hover {
      color: #a5def1 !important;
      background-color: #222e41 !important;
    }
  }
  
  .el-pagination__total,
  .el-pagination__jump {
    color: #88a7b1 !important;
  }
  
  .el-input__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
  }
}

.el-form {
  .el-form-item__label {
    color: #ffffff !important;
  }
  
  .el-input__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
    
    &:focus {
      border-color: #3a7b99 !important;
    }
    
    &::placeholder {
      color: rgba(255, 255, 255, 0.6) !important;
    }
  }
  
  .el-textarea__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
    
    &:focus {
      border-color: #3a7b99 !important;
    }
    
    &::placeholder {
      color: rgba(255, 255, 255, 0.6) !important;
    }
  }
  
  .el-select .el-input__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
  }
}

.el-select-dropdown {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  
  .el-select-dropdown__item {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    
    &:hover {
      background-color: #222e41 !important;
      color: #a5def1 !important;
    }
    
    &.selected {
      background-color: #3a7b99 !important;
      color: #ffffff !important;
    }
  }
}

.el-button {
  &--primary {
    background: linear-gradient(135deg, #3a7b99 0%, #70afce 100%) !important;
    border-color: #3a7b99 !important;
    color: #ffffff !important;
    
    &:hover {
      background: linear-gradient(135deg, #4189aa 0%, #a5def1 100%) !important;
      border-color: #4189aa !important;
    }
  }
  
  &--default {
    background-color: transparent !important;
    border-color: #5f6e8a !important;
    color: #88a7b1 !important;
    
    &:hover {
      background-color: #222e41 !important;
      border-color: #a5def1 !important;
      color: #a5def1 !important;
    }
  }
  
  &--success {
    background-color: #67c23a !important;
    border-color: #67c23a !important;
    
    &:hover {
      background-color: #85ce61 !important;
      border-color: #85ce61 !important;
    }
  }
  
  &--warning {
    background-color: #e6a23c !important;
    border-color: #e6a23c !important;
    
    &:hover {
      background-color: #ebb563 !important;
      border-color: #ebb563 !important;
    }
  }
  
  &--danger {
    background-color: #f56c6c !important;
    border-color: #f56c6c !important;
    
    &:hover {
      background-color: #f78989 !important;
      border-color: #f78989 !important;
    }
  }
}

.el-dialog {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  
  .el-dialog__header {
    background-color: #2a3950 !important;
    border-bottom: 1px solid #5f6e8a !important;
    
    .el-dialog__title {
      color: #ffffff !important;
    }
    
    .el-dialog__headerbtn .el-dialog__close {
      color: #88a7b1 !important;
      
      &:hover {
        color: #a5def1 !important;
      }
    }
  }
  
  .el-dialog__body {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
  }
  
  .el-dialog__footer {
    background-color: #2a3950 !important;
    border-top: 1px solid #5f6e8a !important;
  }
}

.el-message-box {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  
  .el-message-box__title {
    color: #ffffff !important;
  }
  
  .el-message-box__message {
    color: #ffffff !important;
  }
  
  .el-message-box__content {
    color: #ffffff !important;
  }
}

.el-loading-mask {
  background-color: rgba(70, 87, 110, 0.8) !important;
}

.el-loading-spinner {
  .path {
    stroke: #a5def1 !important;
  }
  
  .el-loading-text {
    color: #ffffff !important;
  }
}

